import { Card } from "antd";
import Link from "next/link";

export default function Home() {
  const navList = [
    {
      name: "爬取网页数据",
      url: "/web/cheerio",
      title: "网页爬虫",
    },
    {
      name: "使用canvas绘制图表，附带动画使用",
      url: "/web/canvas",
      title: "canvas绘制部署",
    },
  ];
  return (
    <main className="flex flex-wrap">
      {navList.map((item, index) => {
        return (
          <Card
            style={{ width: "calc(24vw)", margin: "10px 0.5vw" }}
            key={index}
            title={item.title}
            extra={
              <Link className="text-blue-500 font-bol" href={item.url}>
                查看
              </Link>
            }
          >
            {item.name}
          </Card>
        );
      })}
    </main>
  );
}
